<template>
	<view class="body">
		<view class="success">
			<view class="successIcon">
				<u-icon name="checkmark" color="#fff" size="36"></u-icon>
			</view>
			<view class="text">
				下单成功
			</view>
			<view class="btn">
				<u-button size="medium" style="width: 280upx;background-color:#0055ff;color: #fff;" @click="goBack">返回上一级</u-button>
				<u-button size="medium" style="width: 280upx;background-color:#07c160;color: #fff;" @click="payOrder">去买单</u-button>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return {
				id:null,
			}
		},
		onLoad(val){
			this.id = val.orderId
		},
		methods:{
			// 返回上一级
			goBack(){
				// uni.navigateBack({
				// 	delta: 2
				// });
				history.back(1)
			},
			// 去买单
			payOrder(){
				uni.redirectTo({
					url:'/pages/order/payOrder?orderId=' + this.id
				})
			},
		}
	}
</script>

<style lang="less" scoped>
	.body{
		background-color: #fff;
		display: flex;
		width:100%;
		height:100%;
		justify-content: center;
		// align-items: center;
	}
	.success{
		display: flex;
		flex-direction: column;
		align-items: center;
		width:100%;
		margin-top: 120upx;
		.text{
			font-size: 38upx;
			margin: 20upx;
		}
		.successIcon{
			width: 150upx;
			height: 150upx;
			border-radius: 75px;
			display: flex;
			justify-content: center;
			align-items: center;
			background-color: #07c160;
		}
		.btn{
			width: 100%;
			display: flex;
			justify-content: space-around;
			align-items: center;
		}
	}
	
</style>